<!--
@description: 添加用户
@creationTime: 2025-04-22
-->

<route type="page" lang="json5">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '添加'
  }
}
</route>

<template>
  <view>
    <view class="bg-#fff pos-fixed pos-top-none w-100vw z-10">
      <wd-search
        placeholder="请输入姓名，手机号等"
        v-model="searchValue"
        :hide-cancel="true"
        @search="search"
        :focus="true"
      />
    </view>

    <view class="pt-14"></view>

    <wd-card
      class="partner-card w-full max-w-400px shadow-md rounded-lg overflow-hidden"
      v-for="(item, index) in list"
      :key="index"
    >
      <!-- 公司名称标题 -->
      <view class="p-1 flex flex-justify-between flex-items-center">
        <view>
          <text class="c-#0b0e21 text-xl font-bold">{{ item.companyName || item.name }}</text>
          <wd-icon name="edit" size="18" class="text-white ml-auto"></wd-icon>
        </view>

        <wd-icon name="add" size="18" class="text-#3677fa ml-auto" color="#3677fa" @click="addUser(item)">添加</wd-icon>
      </view>

      <!-- 详细信息 -->
      <view class="p-1 space-y-1">
        <!-- 负责人 -->
        <view class="flex items-center">
          <wd-icon name="user" size="18" class="text-blue-500 mr-2"></wd-icon>
          <view class="flex-1">
            <text class="text-gray-500 mr-2">名称：</text>
            <text class="text-gray-800">{{ item.username }}</text>
          </view>
        </view>

        <!-- 联系电话 -->
        <view class="flex items-center">
          <wd-icon name="phone" size="18" class="text-blue-500 mr-2"></wd-icon>
          <view class="flex-1">
            <text class="text-gray-500 mr-2">联系电话：</text>
            <text class="c-#347cd0">{{ item.mobile }}</text>
          </view>
        </view>

        <!-- 公司地址 -->
        <view class="flex items-start">
          <wd-icon name="location" size="18" class="text-blue-500 mr-2 mt-1"></wd-icon>
          <view class="flex-1">
            <text class="text-gray-500 mr-2">地址：</text>
            <text class="c-#347cd0">{{ getAddress(item) }}</text>
          </view>
        </view>
      </view>
    </wd-card>
  </view>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { queryAllListCompanyApi, addBindCompanyApi } from '@/api/userInfoByType'
import { useUserStore } from '@/store'

import { useColPickerData } from '@/hooks/useColPickerData'
const { userInfo } = useUserStore()
const searchValue = ref('')
const list = ref([])
const userType = ref('')
const { mapCodeToText } = useColPickerData()
onLoad(res => {
  userType.value = res.type
})
const search = () => {
  uni.showLoading({ title: '搜索中...' })
  queryAllListCompanyApi({
    keyName: searchValue.value,
    userType: userType.value,
    isCompanyActiveAdd: true
  }).then((result: any) => {
    uni.hideLoading()
    list.value = result.data
  })
}
const getAddress = item => {
  if (!item.province) {
    return '未添加地址'
  }
  let data = mapCodeToText([item.province, item.city, item.district])
  return data + item.address
}
const addUser = item => {
  uni.showLoading({ title: '添加中...' })
  addBindCompanyApi({
    staffUserId: item.id,
    userType: userType.value,
    companyUserId: userInfo.id
  }).then(() => {
    uni.hideLoading()
    uni.showToast({ title: '添加成功', icon: 'success' })
  })
}
</script>

<style lang="scss" scoped></style>
